<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>项目列表</title>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="<%=request.getContextPath() %>/css/bootstrap.min.css">
<link rel="stylesheet" href="<%=request.getContextPath() %>/css/bootstrap-datetimepicker.min.css">
<link rel="stylesheet" href="<%=request.getContextPath() %>/css/bootstrap-table.min.css">
<!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<link rel="stylesheet" href="<%=request.getContextPath() %>/css/bootstrap-theme.min.css" >
<!-- 最新的 Bootstrap 核心 JavaScript 文件  要将jquery的包放在bootstrap之前-->
<script src="<%=request.getContextPath() %>/js/jquery-1.9.1.js"></script>
<script src="<%=request.getContextPath() %>/js/bootstrap.min.js"></script>
<script src="<%=request.getContextPath() %>/js/bootstrap-datetimepicker.min.js"></script>
<script src="<%=request.getContextPath() %>/js/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="<%=request.getContextPath() %>/js/bootstrap-table.min.js"></script>
<script src="<%=request.getContextPath() %>/js/bootstrap-table-zh-CN.min.js"></script>
</head>
<body>
<div id="toolbar">
            <div class="form-inline" role="form">
                <div class="form-group">
                  <span>项目名称：</span>
                    <input name="projectName" id="projectNameParam" class="form-control" type="text" placeholder="项目名称">
                </div>
                <input type="button" class="btn btn-primary" onclick="_search()" value="查询" />
            </div>
        </div>
<table id="prjTable"></table>
<!-- 删除确认框 -->
<div class="modal fade" id="delConfirmModal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="gridSystemModalLabel">删除提示</h4>
      </div>
      <div class="modal-body">
        <div class="row">
          <div class="col-md-4">你确定要删除吗？</div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        <button type="button" class="btn btn-primary" onclick="delConfirm()">确认</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<!-- 修改模态窗 -->
        <div class="modal fade" id="modifyModal">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">×</button>
                        <h4 class="modal-title">修改信息</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-inline">
                            <div class="form-group">
                                <label for="modifyNameText">项目名称：</label>
                                <input id="modifyProjectId" type="hidden">
                                <input id="modifyProjectName" class="form-control input-sm">
                            </div>
                            <div class="form-group">
                                <label for="modifyAgeText">项目编码：</label>
                                <input id="modifyProjectCode" class="form-control input-sm">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="modifyAddressText">项目单位：</label>
                            <input id="modifyProjectUnit" class="form-control input-sm">
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button class="btn btn-primary" id="saveModify">保存</button>
                    </div>
                </div>
            </div>
        </div>

<script type="text/javascript">
var tableData = $('#prjTable');
tableData.bootstrapTable({
url: "<%=request.getContextPath()%>/projectList", 
dataType: "json",
pagination: true, //分页
singleSelect: false,
toolbar:"#toolbar",
showRefresh:true,// 显示刷新按钮
showColumns:true, // 显示所有的列
//data-locale:"zh-CN", //表格汉化
search: false, //显示搜索框
striped:true,
sidePagination: "server", //服务端处理分页
pageList:[5,10,15,20,50],
sortName : 'createDate', // 排序字段
sortOrder : 'desc', // 排序方式
sortable: true, //是否启用排序
queryParams: function (params) {
    return {
            //rows: this.pageSize,
            //page: this.pageNumber,
            offset: params.offset,  //页码
            limit: params.limit,   //页面大小
            search : params.search, //搜索
            order : params.order, //排序
            ordername : params.sort, //排序
            projectName:$("#projectNameParam").val()
        };
    },
      columns: [
	    	  {
	              checkbox:true
	            }, 
              {
                title: '项目名称',
                  field: 'projectName',
                  align: 'left',
                  valign: 'middle'
              }, 
              
              {
                  title: '项目编码',
                  field: 'projectCode',
                  align: 'center',
                  valign: 'middle',
              }, 
              {
                  title: '电压等级',
                  field: 'voltage',
                  align: 'center'
              },
              {
                  title: '项目类型',
                  field: 'projectType',
                  align: 'center'
              },
              {
                  title: '项目单位',
                  field: 'projectUnit',
                  align: 'center',
              },
              {
                  title: '创建人',
                  field: 'createUser',
                  align: 'center',
              },
              
              {
                  title: '操作',
                  field: 'projectId',
                  align: 'center',
                  formatter:function(value,row,index){
               var e = '<a href="javascript:void(0)" onclick="showEditUI(\''+ row.projectId +'\')">编辑</a> ';
               var d = '<a href="javascript:void(0)" onclick="delUI(\''+ row.projectId +'\')">删除</a> ';
               var download = '<a href="javascript:void(0)" onclick="downloadFile(\''+ row.projectId +'\')">下载附件</a> ';
               return e+d+download;
                } 
              }
              
          ]  
  });
  
//查询		
function _search()
{
	 $('#prjTable').bootstrapTable('refresh', {url: 'projectList'});  
}

// 下载附件
function downloadFile(projectId)
{
	//alert(projectId);
	window.location.href="fileDownload?projectId=" + projectId;
}

var delProjectId = "";
 // 删除数据
 function delUI(projectId)
 {
	 // 删除时，将项目id赋值
	 delProjectId = projectId;
	 // 用户确认删除
	 $("#delConfirmModal").modal("show");
	 
 }
 
 // 确认删除
 function delConfirm()
 {
	 // 后台删除
	 $.get("delProjectAction",{projectId:delProjectId},function(data){
		 // 标记是否删除成功
		 if (data == "1")
			 {
			 // 关闭弹窗
			 $("#delConfirmModal").modal("hide");
			 alert("删除成功！");
			 // 刷新数据
			 $('#prjTable').bootstrapTable('refresh', {url: 'projectList'});
			 }
	 });
	 
 }
 
 // 编辑时，弹出数据框
 function showEditUI(projectEditId)
 {
	 $.get("queryProjectByIdAction",{projectId:projectEditId},function(data){
		 // 给每一个输入框赋值
		 $("#modifyProjectId").val(data.projectId);
		 $("#modifyProjectName").val(data.projectName);
		 $("#modifyProjectCode").val(data.projectCode);
		 $("#modifyProjectUnit").val(data.projectUnit);
	 },"json");
	// 显示弹窗
	 $("#modifyModal").modal("show");
 }
 
 $("#saveModify").click(function(){
	 var prjInfo = {
			 projectId:$("#modifyProjectId").val(),
			 projectName:$("#modifyProjectName").val(),
			 projectCode:$("#modifyProjectCode").val(),
			 projectUnit:$("#modifyProjectUnit").val()
	 };
	 // 后台提交保存的请求
	 $.post("saveEditProjectAction",{editProject:JSON.stringify(prjInfo)},function(data){
		 if (data == "1")
			 {
			   alert("修改成功");
			// 关闭弹窗
			$("#modifyModal").modal("hide");
			// 刷新数据
			 $('#prjTable').bootstrapTable('refresh', {url: 'queryProjectAction'});
			 }
	 });
 });
</script>
</body>
</html>